﻿<h2>
    Products</h2>
<ul>
    <ol>
        Add Product</ol>
    <ol>
        Delete Product</ol>
    <ol>
        Edit Product</ol>
    <ol>
        Detial Product</ol>
</ul>
<div>
    <table id="main">
       
    </table>
</div>
<!--====== Template ======-->
<script id="list" type="text/x-jsrender">
        <caption>
        {{:caption}}
        </caption>
        <thead>
        <tr>
            {{for columns}}
                <th width="100">{{:name}}</th>
            {{/for}}
        </tr>
        </thead>
        <tbody>
            {{for rows}}
                <tr>
                    <td><input id="Add_{{:id}}" type="button" value="Add"/></td>
                    <td><input id="Delete_{{:id}}" type="button" value="Delete"/></td>
                    <td><input id="Edit_{{:id}}" type="button" value="Edit"/></td>
                    <td>{{:id}}</td>
                    <td>{{:name}}</td>
                    <td>{{:url}}</td>
                </tr>
            {{/for}}
        </tbody>
        <tfoot>
        </tfoot>
       
</script>
<!--====== Template ======-->
<script type="text/javascript">
    var data = {
        caption: "产品列表",
        footer: "1/1",
        columns: [{ name: "" }, { name: "" }, { name: "" }, { name: "编号" }, { name: "产品名称" }, { name: "产品图片"}],
        rows: [
                { id: "AK0001", name: "product_ak0001", url: "" },
                { id: "AK0002", name: "product_ak0002", url: "" },
                { id: "AK0003", name: "product_ak0003", url: "" },
                { id: "AK0004", name: "product_ak0004", url: "" },
                { id: "AK0005", name: "product_ak0005", url: "" },
                { id: "AK0006", name: "product_ak0006", url: "" },
                { id: "AK0007", name: "product_ak0007", url: "" }
               ]
    };

    var html = $("#list").render(data);

    // Insert as HTML
    $("#main").html(html);
</script>
